<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="/js/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/css/common.css" media="all">
  <link rel="stylesheet" href="../viewstyle/css/publicform.css">
  <script src="/js/layui/layui.all.js"></script>
  <script src="/admin/js/token.js"></script>
</head>
<body>

<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-form layui-card-header layuiadmin-card-header-auto">
      <div class="layui-form-item">

        <div class="layui-inline">
          <label class="layui-form-label">区域</label>
          <div class="layui-input-inline">
            <select name="city" lay-verify="required" id="area" lay-filter="region">
              <option value="">选择区域</option>
            </select>
          </div>
        </div>


        <div class="layui-inline">
          <div class="layui-form">
            <div class="layui-form-item">
              <div class="layui-input-inline">
                <input type="text" class="layui-input" id="begin" placeholder="开始时间">
              </div>
              <div class="layui-form-mid">
                -
              </div>
              <div class="layui-input-inline">
                <input type="text" class="layui-input" id="end" placeholder="结束时间">
              </div>
            </div>
          </div>
        </div>

        <div class="layui-inline">
            <input type="text" id="stationid"  placeholder="站点的编号或名称" autocomplete="off" class="layui-input">
        </div>

        <div class="layui-inline">
          <button id="btnsearch"  class="layui-btn ">
            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>搜索
          </button>
        </div>

      </div>
    </div>


    <div class="layui-card-body">
      <table id="station" class="layui-hide" lay-filter="t"></table>
    </div>

  </div>
</div>


</body>

<!--<script type="text/html" id="tb">
  <div class="layui-container">

  </div>
</script>-->

<script type="text/html" id="delAndEdit">
  <input type="button" id="edit" value="站点配置" class="layui-btn layui-btn-xs" lay-event="update"/>
</script>
<script>
    var $ = layui.$;
    var laydate = layui.laydate;
    var form = layui.form;
    var table = layui.table;
      var token=layui.data("local_store").token;
    // 执行一个laydate实例
    laydate.render({
      elem: '#begin', //指定元素
      type: 'datetime'
    });
    laydate.render({
      elem: '#end', //指定元素
      type: 'datetime'
    });
    table.render({
      elem: "#station",
      url: "/admin/station/selectAllStation?token="+token,
      id: "t",
      toolbar: "#tol",
      cols: [[{
        title: "站点编号",
        field: "station_bh",
        width: "7%",
        fixed: "left",
        align: "center"
      }
        , {
          title: "站点名称",
          field: "station_name",
          width: "9%",
          align: "center"
        }
        , {
          title: "区域",
          field: "station_quyu",
          width: "6%",
          align: "center"
        }
        , {
          title: "类型",
          field: "station_type_name",
          width: "6%",
          align: "center"
        }
        , {
          title: "模式",
          field: "station_model",
          width: "6%",
          align: "center"
        }
        , {
          title: "最大终端数",
          field: "station_maximum_number_of_terminals",
          width: "10%",
          align: "center"
        }
        , {
          title: "已绑定终端数",
          field: "staion_current_number_o_terminals",
          width: "11%",
          align: "center"
        }
        , {
          title: "联系电话",
          field: "station_phone",
          width: "9%",
          align: "center"
        }
        , {
          title: "密码",
          field: "station_password",
          width: "8%",
          align: "center"
        }
        , {
          title: "创建时间",
          field: "station_create_time",
          width: "10%",
          align: "center"
        }
        , {
          title: "所属用户",
          field: "admin_name",
          width: "8%",
          align: "center"
        }
        , {
          title: "操作",
          width: "10%",
          align: "center",
          toolbar: "#delAndEdit",
          fixed: "right"
        }
        , {
          title: "id",
          field: "station_id",
          hide: true
        }
      ]],
      page: true,
    })

    //    删除的监听事件
    table.on("tool(t)", function (obj) {
        var getdata = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

      switch (layEvent) {
        case "update":

          var local_store = layui.data("local_store");
          var local = local_store.token;

          $.ajax({
            url: "/admin/station/query/ZhanDianPeiZhi?stationId="+getdata.station_id,
            type: 'get',
            dataType: "json",
            contentType:"application/json;charset=utf-8",
            beforeSend: function(request) {
              request.setRequestHeader("token", local);
            },
            success: function (res) {
              if (res.code == 500) {
                layer.msg("权限报错,请联系管理人员", {icon: 5});//失败的表情
                return;
              } else if (res.code == 200) {
                open("/admin/station_config/index.html?id="+getdata.station_id+"#/layui/grid", "_blank");
              }
            },
            complete: function () {
              layer.close(this.layerIndex);
            },
          });

          break;
      }
    });

    //搜索的监听时间
    $('#btnsearch').click(function () {
      table.reload('t', {
        where: {
          station_area: $("#area").val(),
          station_create_time: $("#begin").val(),
          station_end_time: $("#end").val(),
          station_name: $("#stationid").val()
        },
        page: {
          curr: 1
        }
      })
    })

    //键盘回车监听
    $(window).keypress(function (event) {
      if(event.which === 13){
        $('#btnsearch').click();
      }
    })


    //    区域下拉列表的监听事件
    $.ajax({
      url: '/admin/region/SelectregionAll',
      type: "get",
      success: function (res) {
        if (res.code == 200) {
          for (var i = 0; i < res.data.length; i++) {
            $('#area').append(new Option(res.data[i].regionName, res.data[i].regionId));
          }
          layui.form.render("select");
        }
      }
    })
</script>
</html>
